import React from 'react'
import withLogin from '../../hoc/withLogin'
import styles from './css/ticket.module.css'
import { CapsuleTabs } from 'antd-mobile'
import { Collapse } from 'antd-mobile'
import { useNavigate } from 'react-router-dom'
function Ticket() {
  const nav=useNavigate()
  return (
    <div >
      <Collapse defaultActiveKey={['1']}>
          <Collapse.Panel key='1' title='展开'>
           车票详情
          </Collapse.Panel>
       
        </Collapse>
      <div className={styles.box} onClick={()=>nav('/ck')}>
        <span>
        T8
      </span>
      <span>
        北京
      </span>
      <span>
        上海
      </span>
      <span>
        10:00
      </span>
      <span>
        11:00
      </span>
      <span>
        二等座
      </span>
      <span>
        有票
      </span>
      <span>
        8
      </span>
      </div>
      <div className={styles.box}>
        <span>
        T8
      </span>
      <span>
        北京
      </span>
      <span>
        上海
      </span>
      <span>
        10:00
      </span>
      <span>
        11:00
      </span>
      <span>
        二等座
      </span>
      <span>
        有票
      </span>
      <span>
        8
      </span>
      </div>
      <div className={styles.box}>
        <span>
        T8
      </span>
      <span>
        北京
      </span>
      <span>
        上海
      </span>
      <span>
        10:00
      </span>
      <span>
        11:00
      </span>
      <span>
        二等座
      </span>
      <span>
        有票
      </span>
      <span>
        8
      </span>
      </div>
      <div className={styles.box}>
        <span>
        T8
      </span>
      <span>
        北京
      </span>
      <span>
        上海
      </span>
      <span>
        10:00
      </span>
      <span>
        11:00
      </span>
      <span>
        二等座
      </span>
      <span>
        有票
      </span>
      <span>
        8
      </span>
      </div>
      <div className={styles.box}>
        <span>
        T8
      </span>
      <span>
        北京
      </span>
      <span>
        上海
      </span>
      <span>
        10:00
      </span>
      <span>
        11:00
      </span>
      <span>
        二等座
      </span>
      <span>
        有票
      </span>
      <span>
        8
      </span>
      </div>
      <div className={styles.box}>
        <span>
        T8
      </span>
      <span>
        北京
      </span>
      <span>
        上海
      </span>
      <span>
        10:00
      </span>
      <span>
        11:00
      </span>
      <span>
        二等座
      </span>
      <span>
        有票
      </span>
      <span>
        8
      </span>
      </div>
      <div className={styles.box}>
        <span>
        T8
      </span>
      <span>
        北京
      </span>
      <span>
        上海
      </span>
      <span>
        10:00
      </span>
      <span>
        11:00
      </span>
      <span>
        二等座
      </span>
      <span>
        有票
      </span>
      <span>
        8
      </span>
      </div>
      <div className={styles.box}>
        <span>
        T8
      </span>
      <span>
        北京
      </span>
      <span>
        上海
      </span>
      <span>
        10:00
      </span>
      <span>
        11:00
      </span>
      <span>
        二等座
      </span>
      <span>
        有票
      </span>
      <span>
        8
      </span>
      </div>
      <div className={styles.box}>
        <span>
        T8
      </span>
      <span>
        北京
      </span>
      <span>
        上海
      </span>
      <span>
        10:00
      </span>
      <span>
        11:00
      </span>
      <span>
        二等座
      </span>
      <span>
        有票
      </span>
      <span>
        8
      </span>
      </div>
      <div className={styles.box}>
        <span>
        T8
      </span>
      <span>
        北京
      </span>
      <span>
        上海
      </span>
      <span>
        10:00
      </span>
      <span>
        11:00
      </span>
      <span>
        二等座
      </span>
      <span>
        有票
      </span>
      <span>
        8
      </span>
      </div>
      <div className={styles.box}>
        <span>
        T8
      </span>
      <span>
        北京
      </span>
      <span>
        上海
      </span>
      <span>
        10:00
      </span>
      <span>
        11:00
      </span>
      <span>
        二等座
      </span>
      <span>
        有票
      </span>
      <span>
        8
      </span>
      </div>
      <div className={styles.box}>
        <span>
        T8
      </span>
      <span>
        北京
      </span>
      <span>
        上海
      </span>
      <span>
        10:00
      </span>
      <span>
        11:00
      </span>
      <span>
        二等座
      </span>
      <span>
        有票
      </span>
      <span>
        8
      </span>
      </div>
      <div className={styles.box}>
        <span>
        T8
      </span>
      <span>
        北京
      </span>
      <span>
        上海
      </span>
      <span>
        10:00
      </span>
      <span>
        11:00
      </span>
      <span>
        二等座
      </span>
      <span>
        有票
      </span>
      <span>
        8
      </span>
      </div>
      <div className={styles.box}>
        <span>
        T8
      </span>
      <span>
        北京
      </span>
      <span>
        上海
      </span>
      <span>
        10:00
      </span>
      <span>
        11:00
      </span>
      <span>
        二等座
      </span>
      <span>
        有票
      </span>
      <span>
        8
      </span>
      </div>
      <div className={styles.box}>
        <span>
        T8
      </span>
      <span>
        北京
      </span>
      <span>
        上海
      </span>
      <span>
        10:00
      </span>
      <span>
        11:00
      </span>
      <span>
        二等座
      </span>
      <span>
        有票
      </span>
      <span>
        8
      </span>
      </div>
      <div className={styles.box}>
        <span>
        T8
      </span>
      <span>
        北京
      </span>
      <span>
        上海
      </span>
      <span>
        10:00
      </span>
      <span>
        11:00
      </span>
      <span>
        二等座
      </span>
      <span>
        有票
      </span>
      <span>
        8
      </span>
      </div>
      <div className={styles.box}>
        <span>
        T8
      </span>
      <span>
        北京
      </span>
      <span>
        上海
      </span>
      <span>
        10:00
      </span>
      <span>
        11:00
      </span>
      <span>
        二等座
      </span>
      <span>
        有票
      </span>
      <span>
        8
      </span>
      </div>
      <div className={styles.box}>
        <span>
        T8
      </span>
      <span>
        北京
      </span>
      <span>
        上海
      </span>
      <span>
        10:00
      </span>
      <span>
        11:00
      </span>
      <span>
        二等座
      </span>
      <span>
        有票
      </span>
      <span>
        8
      </span>
      </div>
      <div className={styles.box}>
        <span>
        T8
      </span>
      <span>
        北京
      </span>
      <span>
        上海
      </span>
      <span>
        10:00
      </span>
      <span>
        11:00
      </span>
      <span>
        二等座
      </span>
      <span>
        有票
      </span>
      <span>
        8
      </span>
      </div>
      <div className={styles.box}>
        <span>
        T8
      </span>
      <span>
        北京
      </span>
      <span>
        上海
      </span>
      <span>
        10:00
      </span>
      <span>
        11:00
      </span>
      <span>
        二等座
      </span>
      <span>
        有票
      </span>
      <span>
        8
      </span>
      </div>
      <div className={styles.box}>
        <span>
        T8
      </span>
      <span>
        北京
      </span>
      <span>
        上海
      </span>
      <span>
        10:00
      </span>
      <span>
        11:00
      </span>
      <span>
        二等座
      </span>
      <span>
        有票
      </span>
      <span>
        8
      </span>
      </div>
      <div style={{position:'fixed',left:'0',bottom:'0'}}>
      <CapsuleTabs>
          <CapsuleTabs.Tab title='出发时间' key='fruits'>
            
          </CapsuleTabs.Tab>
          <CapsuleTabs.Tab title='到达时间' key='vegetables'>
            
          </CapsuleTabs.Tab>
          <CapsuleTabs.Tab title='票价' key='animals'>
           
          </CapsuleTabs.Tab>
          <CapsuleTabs.Tab title='车次类型' key='ab'>
           
          </CapsuleTabs.Tab>
        </CapsuleTabs>
      </div>
    </div>
  )
}

export default withLogin(Ticket)